HTML (HyperText Markup Language)，全名為 “超文本標記語言“，是一種用來建立網頁的語言，使用標籤和屬性來描述網頁的結構和內容。簡單來說，它可以告訴瀏覽器網頁裡面哪裡是標題、哪裡是內容、哪裡要換行，還有哪裡要放圖片等等。
HTML 標籤通常由起始標籤(opening tag)、結束標籤(closing tag) 和屬性(attribute) 組成，而元素(element) 是指包含這些標籤和中間內容的整個結構。可以把標籤想像成一個容器，用來描述標籤中間的內容，而屬性則是提供了對元素進行更多描述的方法。
( 圖片取自 MDN Web Docs - HTML 入門-學習該如何開發Web )
一個基本的 HTML 檔案如下：
<!DOCTYPE html> //告訴瀏覽器這是一個 HTML
<html lang="en"> //定義 HTML 文件的開始和結束的標籤
<head>
//定義文檔的元數據，包括文檔標題、引入的 CSS 和 JavaScript 等
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Web Title</title> //定義文檔的標題，顯示在瀏覽器的標題欄上
</head>
<body>
//定義文檔的主體，包括文檔的內容、圖像、超連結等
<h1>這是標題</h1>
<p>這是文字段落</p>
<a href="http://www.example.com">這是超連結</a>
</body>
</html>
下面列舉出一些常見的編輯器，它們可以輸入 ! 來快速建立 HTML5 樣板
- Visual Studio Code
- Sublime Text
- Atom
- Brackets
- Notepad++
從排版的特性來說，HTML 的標籤主要分為兩種類型：區塊元素和行內元素
區塊元素 block
區塊元素是用來將網頁劃分成不同的區塊，裡面可以包含其他元素。區塊元素會默認跟隨父容器的寬度，因此在沒有手動設置的情況下會單獨佔據一行，而它的寬度和高度都是可以調整的。
行內元素 inline
行內元素通常用來標記或修飾文本，並且不會將文檔分成區塊，而是和文字在同一行上。這些標籤的寬度只會根據內容的長度來調整，而高度則會根據字體的大小和行高來決定，不能設置固定的大小。
以下是一些比較常見的元素：
區塊元素
<div>：定義一個文檔區域，通常用於布局和樣式控制<p>：定義一個段落<ul>和<ol>：定義無序列表和有序列表<h1>-<h6>：定義標題，從大到小依次排列
行內元素
<span>：定義一個行內文本區域，通常用於樣式控制<a>：定義一個超鏈接<strong>和<em>：分別定義加粗和斜體文本<img>：定義一個圖像<input>：定義一個表單輸入框
總結：
這段簡單介紹了 HTML 標籤的構成，並且展示了 HTML 最基本的檔案架構。而區塊元素跟行內元素這兩種特性在之後結合 CSS 進行排版時，會是一個必須要知道的概念。
